curPage =1;

.clearfix{

display: block;

/*首先，在body中添加div */

.banBtn{

}

margin-right: 10px;

if(curPage<=pageTotal-2){

var paginationId = doc.getElementById(''+pageOptions.paginationId+'') || doc.getElementById('pagination');

</div>

if(pageTotal>5){

dynamicPagingFunc(pageOptions);

if(pageTotal==curPage){

var pageOptions = {pageTotal:10,curPage:7,paginationId:''};

.active{

}else{

<a><</a>

padding: 0;

var doc = document;

html += '<a>1</a><span>...</span>';

margin: 50px auto ;

}

color: #ff980069;

function dynamicPagingFunc(pageOptions){

html += '<a href="#" >'+i+'</a>';

#prevBtn{

height: 35px;

var pageTotal = pageOptions.pageTotal || 1;

-->

<span>...</span>

}

此外，还要考虑，当前页码 curPage < pageTotal（总页码）-2，才显示 ...

width: 35px;

for(let i = starPage;i <= endPage;i++){

if(pageTotal<=5){

height: 100px;

html += '<a>'+i+'</a>';

endPage = curPage;

border:1px solid #ff980069;

border: 1px solid orangered;

function appendItem(pageTotal,curPage,html){

html+='<a>&lt;</a>';

}

starPage = 1;

endPage = curPage+1;

endPage = 4;

}else{

}

}

margin: 0;

border: 2px solid crimson;

color:orangered ;

}

html += '<a href="#" >'+pageTotal+'</a>';

<a href="#">></a>

text-decoration: none;

<a href="#" >2</a>

<a>1</a>

第三种情况，当前页面curPage>4

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

#nextBtn{

clear: both;

width: 500px;

}

paginationId.innerHTML = html;

第二种情况，当前页面curPage == 4

html = appendItem(pageTotal,curPage,html);

这篇文章主要介绍了JS实现前端动态分页码代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

JavaScript代码

/*总页数大于5时，要分析当前页*/

var starPage = 0;

第一种情况，当前页面curPage < 4

if(curPage<pageTotal-2){

if(i==curPage){

if(curPage>pageTotal){

if(curPage==4){

}

}else if(curPage>4){

}

if(pageTotal<=5){

}else if(pageTotal>5 && curPage<=4){

return html;

html = appendItem(pageTotal,curPage,html);

<div>

}

paginationId.innerHTML = html;

</body>  

<a href="#">10</a>

}

}

var html = '';

.over,.pageItem{

.pageItem{

思路分析：有3种情况

}

<!-- 后面会在JS中动态追加 ，此处为了，实现前端效果，所以注册

}else{

var curPage = pageOptions.curPage||1;

}  

paginationId.innerHTML = html;